<template>
    <div>
        <link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.13.2/skins/default/aliplayer-min.css" />
        <script type="text/javascript" charset="utf-8" src="https://g.alicdn.com/de/prismplayer/2.13.2/aliplayer-min.js"></script>
        <div class="prism-player" id="player-con"></div>
    </div>
</template>
<script>
import vodApi from '../../api/vod';
export default {
    asyncData({ params, error }) {
        return vodApi.getplayAuth(params.vid).then(res => {
            return {
                vid: params.vid,
                playauth: res.data
            }
        })
    },
    mounted() {
        
        var player = new Aliplayer({
            "id": "player-con",
            "vid": this.vid,
            "playauth": this.playauth,
            "qualitySort": "asc",
            "format": "mp4",
            "mediaType": "video",
            "width": "100%",
            "height": "500px",
            "autoplay": true,
            "isLive": false,
            "rePlay": false,
            "playsinline": true,
            "preload": true,
            "controlBarVisibility": "hover",
            "useH5Prism": true
        }, function (player) {
            console.log("The player is created");
        }
        );
    }
}
</script>